// 封装 ajax 请求
// 参数1: 请求方式
// 参数2: 请求地址
// 参数3: 携带的参数 键值对字符串
// 参数4: 回调函数 默认值是 空函数
function myAjax(method , url , data , cb = function(){}){
    // 1, 创建 ajax 对象
    // 兼容低版本IE浏览器
    let xhr = {};
    
    if(XMLHttpRequest){
        //  标准浏览器
        xhr = new XMLHttpRequest();
    }else{
        // 兼容IE低版本
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }

    // 2, 设定open
    if( method === 'get' ){
        xhr.open('get' , `${url}?${data}`);
    }else{
        xhr.open('post' , url);
    }
  
    // 3, 如果是 post 设定请求头
    if ( method === 'post' ){
        xhr.setRequestHeader( 'Content-Type' , 'application/x-www-form-urlencoded' );
    }

    // 4, 发送 send post携带参数
    if( method === 'get' ){
        xhr.send();
    }else{
        xhr.send(data);
    }

    // 5, 请求结束 执行程序
    xhr.onreadystatechange = ()=>{
        
        if(xhr.readyState === 4 && /^2\d{2}$/.test( xhr.status ) ){
            // 请求成功返回响应体体内容
            // 请求成功 执行程序 对应的数据是 响应体数据
            // 也就是后端程序 输出的数据
            // 也就是 xhr.response  或者 xhr.responseText 其中 存储的数据
            cb( xhr.response );
        }else{
            // 请求失败返回报错内容
            // 请求失败的回调函数
        }
    }
}

// 在 封装的 ajax继承之上 再封装一个 promise执行的 ajax
function pAjax( method , url , data ){
    // 创建的promise对象
    const p = new Promise( function( f , r ){
        // 1, 创建 ajax 对象
        // 兼容低版本IE浏览器
        let xhr = {};
        
        if(XMLHttpRequest){
            //  标准浏览器
            xhr = new XMLHttpRequest();
        }else{
            // 兼容IE低版本
            xhr = new ActiveXObject('Microsoft.XMLHTTP');
        }

        // 2, 设定open
        if( method === 'get' ){
            xhr.open('get' , `${url}?${data}`);
        }else{
            xhr.open('post' , url);
        }
    
        // 3, 如果是 post 设定请求头
        if ( method === 'post' ){
            xhr.setRequestHeader( 'Content-Type' , 'application/x-www-form-urlencoded' );
        }

        // 4, 发送 send post携带参数
        if( method === 'get' ){
            xhr.send();
        }else{
            xhr.send(data);
        }

        // 5, 请求结束 执行程序
        xhr.onload = ()=>{
            
            if(xhr.readyState === 4 && /^2\d{2}$/.test( xhr.status ) ){
                // 请求成功返回响应体体内容
                // 请求成功 执行程序 对应的数据是 响应体数据
                // 也就是后端程序 输出的数据
                // 也就是 xhr.response  或者 xhr.responseText 其中 存储的数据
                f( xhr.response );
            }else{
                // 请求失败返回报错内容
                // 请求失败的回调函数
                r();
            }
        } 
    })

    // 返回这个 promise 对象
    return p;
}

// 封装 promise执行 jQuery ajax 程序
// 参数1: 请求的url地址
// 参数2: 请求方式,默认值 get
// 参数3: 携带参数 默认值 空对象
// 参数4: 响应体格式 默认值 文本格式
function pjQueryAjax(url , type = 'get' , data = {} , dataType = 'text' ){
    // 创建promise对象 调用执行 jQuery的ajax
    const p = new Promise(function(f,r){
        $.ajax({
            url:url,
            type:type,
            data:data,
            dataType:dataType,
            success: f ,
            error: r ,
        })
    });

    // return 返回这个 对象
    return p;
}
